//查询样式是否存在
function hasClass(elem, cls) {
    elem = elem || {};
    return new RegExp("\\b" + cls + "\\b").test(elem.className);
};
//添加样式
function addClass(elem, cls) {
    elem = elem || {};
    hasClass(elem, cls) || (elem.className += " " + cls);
    elem.className = elem.className.replace(/^\s|\s$/g, "").replace(/\s+/g, " ");
    return this;
};
//删除样式
function removeClass(elem, cls) {
    elem = elem || {};
    if (hasClass(elem, cls)) {
        elem.className = elem.className.replace(new RegExp("(\\s|^)" + cls + "(\\s|$)"), "");
    }
    return this;
};
/**
 * InputNumber组件
 *
 * @class InputNumber
 * @extends Basic
 *
 * @param [min] 下限
 * @param [max] 上限
 * @param [value] 默认值
 * @param [step] 增减步数
 * @param [onChange] 改变数值回调
 * @param [disabled] 禁用
 * @param [className] 类名
 * @param [id] id
 *
 * 示例:
 *
 *     @example
 *
 *     <InputNumber step="500" max="5000" min="1" value="2000" ref="inputnumber" />
 */
var InputNumber = React.createClass({
    getDefaultProps: function () {
        return {
            min: "",
            max: "",
            value: "",
            step: "",
            onChange: "",
            disabled: "",
            className: "",
            id: ""
        }
    },
    getInitialState: function () {
        return {
            value: this.props.value
        }
    },
    componentDidMount: function(){

    },
    handelAdd: function () {
        var _this = this;
        if(hasClass(_this.refs.add,"disabled")){
            return;
        }
        var v = parseInt(_this.state.value) + parseInt(_this.props.step);
        if (v >= parseInt(_this.props.max)) {
            addClass(_this.refs.add,"disabled");
            v = _this.props.max;
        }
        _this.setState({
            value: v
        });
        _this.props.onChange ? _this.props.onChange(_this.state.value) : "";
    },
    handelLess: function () {
        var _this = this;
        if(hasClass(_this.refs.less,"disabled")){
            return;
        }
        var v = parseInt(_this.state.value) - parseInt(_this.props.step);
        if (v <= parseInt(_this.props.min)) {
            addClass(_this.refs.less,"disabled");
            v = _this.props.min;
        }
        _this.setState({
            value: v
        });
        _this.props.onChange ? _this.props.onChange(_this.state.value) : "";
    },
    handleChange: function (e) {
        var _this = this;
        var _e = e.target || e.srcElement;
        var v = _e.value;
        if (v > parseInt(_this.props.max)) {
            v = _this.props.max;
            addClass(_this.refs.add,"disabled");
        } else if (v < parseInt(_this.props.min)) {
            v = _this.props.min;
            addClass(_this.refs.less,"disabled");
        }

        if (!isNaN(v)) {
            _this.setState({
                value: v
            });
        } else {
            _this.setState({
                value: _this.props.min
            });
        }

        _this.props.onChange ? _this.props.onChange(_this.state.value) : "";
    },
    /**
     * 设置输入框中的value
     * @param {string}
     * */
    setValue: function(v){
        this.setState({
            value: v
        });
    },
    /**
     * 获取输入框中的value
     * @return {string}
     * */
    getValue: function(){
        return this.state.value;
    },
    render: function () {
        var classNameLess="";
        var classNameAdd="";

        if(this.props.disabled || this.state.value <= this.props.min){
            classNameLess = "disabled";
        }
        if(this.props.disabled || this.state.value >= this.props.max){
            classNameAdd = "disabled";
        }
        return (
            <div className={this.props.className?"ucs-input-number "+this.props.className:"ucs-input-number"} id={this.props.id}>
                <a className={"less iconfont icon-less "+classNameLess} onClick={this.handelLess.bind(this)} ref="less"></a>
                <input disabled={this.props.disabled} onChange={this.handleChange.bind(this)} value={this.state.value} className="ucs-input" ref="inputnumber"/>
                <a className={"add iconfont icon-add "+classNameAdd} onClick={this.handelAdd.bind(this)} ref="add"></a>
            </div>
        )
    }
});
module.exports = InputNumber;
